<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<c:set var="ctx" value="${pageContext.request.contextPath}"></c:set> 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>采购计划管理</title>

    <link rel="shortcut icon" href="${ctx}/favicon.ico"> 
    <link href="${ctx}/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
    <link href="${ctx}/css/font-awesome.css?v=4.4.0" rel="stylesheet">
    <link href="${ctx}/css/animate.css" rel="stylesheet">
    <link href="${ctx}/css/style.css?v=4.1.0" rel="stylesheet">
    <link href="${ctx}/css/plugins/iCheck/custom.css" rel="stylesheet">
</head>
<body>
        <div class="row" style="margin:10px;">
                <div class="col-sm-12">
                    <div class="tabs-container">
                        <ul class="nav nav-tabs">
                            <li class="active">
                                <a data-toggle="tab" href="#tab-1" aria-expanded="true"> 采购计划列表</a>
                            </li>
                            <li class="">
                                <a data-toggle="tab" href="#tab-2" aria-expanded="false">添加采购计划</a>
                            </li>
                            <li class="">
                                    <a data-toggle="tab" href="#tab-3" aria-expanded="false">更改采购计划</a>
                            </li>
                        </ul>
                        <div class="tab-content">
                            <div id="tab-1" class="tab-pane active">
                                <div class="panel-body" style="height:500px;">
                                    <div class="row">
                                        <div class="col-sm-12">
                                            <div class="ibox float-e-margins">
                                                
                                                <div class="ibox-content">
                                                    <div class="row">
                                                        <div class="col-sm-3 m-b-xs">
                                                               <input type="text" name="values" style="font-size:18px;margin-top:2px;" autocomplete="off"/>
                                                        </div>
                                                        <div class="col-sm-2 m-b-xs">
                                                            <div data-toggle="buttons" >
                                                                <div class="btn btn-sm btn-white" style="height:35px;font-size:18px;margin-left:-75px;" onclick="findLike()">
                                                                        &nbsp;&nbsp;查&nbsp;找&nbsp;&nbsp;
                                                                </div>
                                                            </div>
                                                        </div>
                                                        
                                                    </div>
                                                    <div class="table-responsive" style="height:400px;">
                                                        <table class="table table-striped">
                                                            <thead>
                                                            <tr>
                                                                <th>商品名称</th>
                                                                <th>价格</th>
                                                                <th>规格</th>
                                                                <th>数量</th>
                                                                <th>采购人</th>
                                                                <th>厂商</th>
                                                                <th>备注</th>
                                                            </tr>
                                                            </thead>
                                                            <tbody>
                                                            <c:forEach var="purchaselist" items="${purchase_list}">
                                                            	<tr>     
                                                                	<td>${purchaselist.goods_name}</td>
                                                                	<td>${purchaselist.price}</td>
                                                                	<td>${purchaselist.unit}</td>
                                                                	<td>${purchaselist.number}</td>
                                                                	<td>${purchaselist.purchase_name}</td>
                                                                	<td>${purchaselist.supplier_}</td>
                                                                	<td>${purchaselist.remark}</td>
                                                            	</tr>
                                                            </c:forEach>
                                                           
                                                            </tbody>
                                                        </table>
                                                    </div>
                                					<div>
                            								<!-- <span style="float:left;">共25条数据5页</span> -->
                            								<div id="page" style="text-align:right;"></div>
                            						</div>
                                                </div>
                                            </div>
                                        </div>
                                
                                </div>
                                </div>
                            </div>
                            <div id="tab-2" class="tab-pane">
                                <div class="panel-body"style="height:500px;">
                                    <div class="ibox-content" style="padding-top:50px;">
                                        <form class="form-horizontal" action="${ctx}/PurchaseServlet/addInfo">
                                            <div class="form-group">
                                                <label class="col-sm-3 control-label">商品名称：</label>
                                
                                                <div class="col-sm-4">
                                                    <select name="goods_id" class="form-control">
                                                    	<c:forEach var="goodslist" items="${goods_list}">
                                                    		<option value="${goodslist.goods_id}">${goodslist.goods_name}</option>
                                                    	</c:forEach>
                                                    </select>
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label class="col-sm-3 control-label">价格：</label>
                                                <div class="col-sm-4">
                                                    <input type="text" placeholder="价格" class="form-control" name="price" autocomplete="off"/>
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label class="col-sm-3 control-label">规格：</label>
                                
                                                <div class="col-sm-4">
                                                    <select name="unit" class="form-control">
                                                        <option value="斤">斤</option>
                                                        <option value="公斤">公斤</option>
                                                        <option value="箱">箱</option>
                                                        <option value="袋">袋</option>
                                                    </select>
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label class="col-sm-3 control-label">数量：</label>
                                                <div class="col-sm-4">
                                                    <input type="text" placeholder="数量" class="form-control" name="number" autocomplete="off"/>
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label class="col-sm-3 control-label">采购人：</label>
                                                <div class="col-sm-4">
                                                    <select name="purchase_people_id" class="form-control">
                                                    	<c:forEach var="peoplelist" items="${people_list}">
                                                    		<option value="${peoplelist.purchase_people_id}">${peoplelist.purchase_name}</option>
                                                    	</c:forEach>
                                                    </select>
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label class="col-sm-3 control-label">厂商：</label>
                                                <div class="col-sm-4">
                                                    <select name="supplier_id" class="form-control">
                                                    	<c:forEach var="supplierlist" items="${supplier_list}">
                                                    		<option value="${supplierlist.supplier_id}">${supplierlist.supplier_}</option>
                                                    	</c:forEach>
                                                       
                                                    </select>
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                    <label class="col-sm-3 control-label">备注：</label>
                                                    <div class="col-sm-4">
                                                        <input type="text" placeholder="备注" class="form-control" name="remark" autocomplete="off"/>
                                                    </div>
                                            </div>
                                            <div class="form-group" style="margin-top:30px;">
                                                <div class="col-sm-offset-4 col-sm-8">
                                                    <button class="btn btn-sm btn-white" type="submit">添加采购计划</button>
                                                </div>
                                            </div>
                                        </form>
                                    </div>
                                </div>
                            </div>
                            <div id="tab-3" class="tab-pane">
                                    <div class="panel-body"style="height:500px;">
                                            <div class="row">
                                                    <div class="col-sm-12">
                                                        <div class="ibox float-e-margins">
                                                            
                                                            <div class="ibox-content">
                                                                <!-- <div class="row">
                                                                    <div class="col-sm-2 m-b-xs">
                                                                        <input type="text" name="values" style="font-size:18px;" autocomplete="off"/>
                                                                    </div>
                                                                    <div class="col-sm-2 m-b-xs">
                                                                        <div data-toggle="buttons" >
                                                                            <div class="btn btn-sm btn-white" style="height:35px;font-size:18px;">
                                                                                    &nbsp;&nbsp;查&nbsp;找&nbsp;&nbsp;
                                                                            </div>
                                                                        </div>
                                                                    </div>
                                                                    
                                                                </div> -->
                                                                <div class="table-responsive">
                                                                    <table class="table table-striped">
                                                                        <thead>
                                                                        <tr>
                                                                            <th>商品名称</th>
                                                                            <th>价格</th>
                                                                            <th>规格</th>
                                                                            <th>数量</th>
                                                                            <th>采购人</th>
                                                                            <th>厂商</th>
                                                                            <th>备注</th>
                                                                            <th>修改</th>
                                                                            <th>删除</th>
                                                                        </tr>
                                                                        </thead>
                                                                        <tbody>
	                                                                        <c:forEach var="purchaselist" items="${purchase_list}">
	                                                            				<tr id="${purchaselist.purchase_id}">     
	                                                                				<td>${purchaselist.goods_name}</td>
	                                                                				<td>${purchaselist.price}</td>
	                                                                				<td>${purchaselist.unit}</td>
				                                                                	<td>${purchaselist.number}</td>
				                                                                	<td>${purchaselist.purchase_name}</td>
				                                                                	<td>${purchaselist.supplier_}</td>
				                                                                	<td>${purchaselist.remark}</td>
				                                                                	<td>
                                                                                		<a><img src="${ctx}/image/update.png" onclick="editinfo(${purchaselist.purchase_id})"/></a>                           
                                                                            		</td>
                                                                            		<td>
                                                                                		<a><img src="${ctx}/image/delete.png" onclick="deleteinfo(${purchaselist.purchase_id})"/></a>                           
                                                                            		</td>
	                                                            				</tr>
	                                                            			</c:forEach>
                                                                        </tbody>
                                                                    </table>
                                                                </div>
                                            					 
                                                            </div>
                                                        </div>
                                                    </div>
                                            
                                            </div>
                                    </div>
                             </div>
                        </div>       
                    </div>
                </div>
            </div>
</body>
    <!-- 全局js -->
    <script src="${ctx}/js/jquery.min.js?v=2.1.4"></script>
    <script src="${ctx}/js/bootstrap.min.js?v=3.3.6"></script>
    <script src="${ctx}/dist/layer-v3.1.1/layer/layer.js"></script>
    <script src="${ctx}/dist/jquery-bootstrap-pagination/jquery-bootstrap-pagination.js"></script>
    <script src="${ctx}/dist/jquery.validate/jquery.validate.min.js"></script>
	<script src="${ctx}/dist/jquery.validate/messages_zh.min.js"></script>
    
    <script>
  //表单验证
	$('form').validate({
        rules:{            
            price:{
                required:true,
                number:true,
            },
            number:{
                required:true,
                number:true,
            }
        },
        messages:{
            price:{
                required:"请输入商品价格！",
                number:"请输入数字！",
            },
            number:{
                required:"请输入商品数量！",  
                number:"请输入数字！",
            }
        }
    });
    
    	function findLike() {
    		values=$('[name=values]').val();
    		location="${ctx}/PurchaseServlet/selectLikeValuesList?values="+values;
		}
    
    
	  //分页
		$("#page").pagination({
		  total_pages:${pageCount},
		  current_page:${pageNum},
		  prev: "上一页",
		  next: "下一页",
		  display_max:4,
		  callback: function(event, page) {
		      //return alert("Page " + page + " was clicked!");
		      location="${ctx}/PurchaseServlet/list?pageNum="+page;
		}
		}); 
    
    
    
    
    	<c:if test="${addmsg}!=null">
			alert('${addmsg}');
		</c:if>
            function editinfo(purchase_id){
            	layer.open({
    	 			type:2,
    	 			content:['${ctx}/PurchaseServlet/preEditInfo?purchase_id='+purchase_id,'no'],
    	 			area:['65%','75%'],
    	 			offset:['10%','20%']
    	 		});
            }
            
            //删除本条采购记录
            function deleteinfo(purchase_id){
            	if(confirm('确定删除所选吗？')){
	            	$.get('${ctx}/PurchaseServlet/deleteInfo',{'purchase_id':purchase_id},function(data){
	            		if(data){
	    					layer.msg('删除成功');
	    					//在biao中删除数据
	    					document.getElementById(purchase_id).parentNode.removeChild(document.getElementById(purchase_id));
	    				}else{
	    					layer.msg('删除失败');
	    				}
	            	});          		
            	}
            }
            
            history.pushState(null,null,'http://localhost/storehouseManagement/PurchaseServlet/list?pageNum=1');
    </script>
</html>